{include file='fcworker/fc_head'}
{include file='fcworker/fc_headsearch'}
<style type="text/css">
    .controlBox span{
        color: #1c1c1c !important;
        font-size: 12px !important;
        font-weight: bold;
    }
    .contBtn{
        float: right !important;
    }
</style>
<body>
<div id="mescroll" class="mescroll">
    <div id="app">
        <div class="container">
            <div class="numPeople">
                <ul>
                    <a href="javascript:void(0);" data-method="viewclass" data-id="-1" class="checkBtn1"><li><p>所有粉丝</p><span>{$info['gsumall']}</span></li></a>
                    <a href="javascript:void(0);" data-method="viewclass" data-id="17" class="checkBtn1"><li><p>今日新增</p><span>{$info['gsum17']}</span></li></a>
                    <a href="javascript:void(0);" data-method="viewclass" data-id="9" class="checkBtn1"><li><p>客资电话</p><span>{$info['gsum16']}</span></li></a>
                </ul>
            </div>
        </div>

        <div id="append_list">
            {if $list}
            {loop $list $key $item}
            <div class="peoPle">
                <div class="peopleTime">
                    {$item['sid']}.{$item['addtime']}
                </div>
                <div class="peopleInfor">
                    <div class="peopleImg">
                        <img src="{$item['avatar']}">
                        <div class="teamNum">UID:{$item['uid']}</div>
                    </div>
                    <div class="peopleTxt">
                        <h2>{$item['username']}</h2>
                        <p>昵称：{$item['nickname']}</p>
                        <p>{$item['workernameall']}</p>
                    </div>
                    <a href="tel:{$item['mobile']}" class="telBtn"></a>
                </div>
                <div class="information">
                    {loop $item['moreinfo'] $k $v}
                    <p>{$v}</p>
                    {/loop}
                </div>
                <div class="controlBox">
                    <span class="contBtn">更多信息</span>
                </div>
            </div>
            {/loop}
            {/if}
        </div>
        <div class="h110"></div>
        {include file='fcworker/fc_foot'}
        <input type="hidden" name="scan" id="scan" value="{$scan}">
        <input type="hidden" name="page" id="page" value="{$page}">
        <input type="hidden" name="hasNext" id="hasNext" value="{$hasNext}">
    </div>
</div>

</body>
<!--  下拉刷新-->
<script>
    const mescroll = new MeScroll("mescroll", {
        down: {
            auto: false,
            callback: () => {
                mescroll.endSuccess();
                setTimeout(() => {
                    window.location.reload();
                },500)
            }
        },
        up: {
            use: true,
            auto: false,
            isBounce: false,
            callback: (page) => {
                let pageNum = page.num+1;
                let scan = $("#scan").val();
                let op = $("#op").val();
                let postUrl="/{php echo createMobileUrl('X_fans',array('themeid'=>$themeid));}";
                $.ajax({
                    url:postUrl,
                    dataType:'json',
                    method:'post',
                    data: {page:pageNum,id:0,op:op,op2:'',searchtxt:'',scan:scan},
                    success:function (e) {
                        let data = e.data;
                        let error = e.error;
                        let msg = e.msg;
                        let curPageData = data.list; // 接口返回的当前页数据列表
                        if (error!=0){
                            layer.msg(msg);
                        }else{
                            if (data.append_html){
                                $("#append_list").append(data.append_html);
                            }
                            // layer.closeAll();
                        }
                        // loadingState = false;
                        if (data.hasNext){
                            hasNext = 1;
                        }else{
                            hasNext = 0;
                        }
                        $("#hasNext").val(hasNext);
                        mescroll.endSuccess(curPageData.length, hasNext);
                    },
                    fail:function (err) {
                        console.log(err)
                    }
                });
            }
        }
    })
    if(!$("#hasNext").val()) {
        mescroll.lockUpScroll(true);
    }
</script>
<script type="text/javascript">
    var loadingState= false;
    var hasNext = 1;
    $(window).scroll(function(){
        hasNext = $("#hasNext").val();
        var height = $(window).height();
        var scrollSpace = $(window).scrollTop();
        if(scrollSpace>height){
            $('.backTop').fadeIn();
        }else{
            $('.backTop').fadeOut();
        }
        if (scrollSpace >= $(document).height() -  (height*1.2)){
            if (!loadingState && hasNext==1){
                var page = $("#page").val();
                var scan = $("#scan").val();
                var next_page = +page+1;
                loadingState = true;
                $("#page").val(next_page);
                layer.msg('加载中', {
                    icon: 16
                    ,shade: 0.01
                });
                var postUrl="/{php echo createMobileUrl('X_fans',array('themeid'=>$themeid));}";
                $.ajax({
                    url:postUrl,
                    dataType:'json',
                    method:'post',
                    data: {page:next_page,id:0,op:'',op2:'',searchtxt:'',scan:scan},
                    success:function (e) {
                        let data = e.data;
                        let error = e.error;
                        let msg = e.msg;
                        if (error!=0){
                            layer.msg(msg);
                        }else{
                            if (data.append_html){
                                $("#append_list").append(data.append_html);
                            }
                            layer.closeAll();
                        }
                        loadingState = false;
                        if (data.hasNext){
                            hasNext = 1;
                        }else{
                            hasNext = 0;
                        }
                        $("#hasNext").val(hasNext);
                    },
                    fail:function (err) {
                        console.log(err)
                    }
                });
            }
        }
    })
    $('.backTop').click(function(){
        $('body,html').animate({scrollTop:0},500);
    })
    $(function () {
        $('#append_list').on('click','.contBtn',function () {
            if($(this).hasClass('on')){
                $(this).parent().siblings('.information').removeClass('cur');
                $(this).removeClass('on')
            }else{
                $(this).addClass('on')
                $(this).parent().siblings('.information').addClass('cur');
            }
        });
        $('.numPeople').on('click','.checkBtn1',function (e) {
            var id = this.dataset.id;
            var jump_url ='{php echo "/".createMobileUrl("X_fans",array("themeid"=>$themeid));}'+'&scan='+id;
            self.location.href=jump_url;
        });
    })
</script>

</html>